Conversation
브라우저에서 프레임 단위로 재생해 확인한 문제들: - 응답 대기(opening) 중 카드가 먼저 다 펼쳐져 정적인 뒷면 그리드만 남았다. 덱을 대기 동안 유지(맥박/흔들림)하고 결과 도착 후에만 카드를 펼치도록 변경 — API가 느려도 빈 화면이 생기지 않는다. - isFlipped가 회전 시작과 동시에 true라 뒷면 상태에서 광채와 컨페티가 터져 등급이 미리 노출됐다. 강조를 회전 완료 후로 미루고 (RARE_EMPHASIS_DELAY_MS), 광채는 거기서 한 박자 더 뒤에 번지게 했다. - 피날레 확대 카드가 그리드에 파묻혀 '잘못 놓인 카드'처럼 보였다. 스크림을 깔고 카드를 320px로 키웠다. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
배경
10펫 뽑기(
CardPackGame) 동작이 어색하다는 리포트를 받아, dev 서버를 띄우고 브라우저에서 프레임 단위로 캡처해 원인을 특정했습니다.발견한 문제와 수정
1. 응답 대기 중 화면이 죽어 있음
opening(API 호출 중) 단계에서 이미 카드 10장이 전부 펼쳐져, 500ms 만에 정지된 뒷면 그리드만 남고 응답이 올 때까지 아무 움직임이 없었습니다. 지연 3초로 재현하니 2.5초간 완전 정지.→ 덱을 대기 동안 유지(맥박 + 흔들림)하고, 결과가 도착한 뒤에만 카드를 펼치도록 변경. API가 느려도 빈 화면이 생기지 않습니다.
2. 뒤집기 전에 등급이 새어나감
isFlipped가 회전 시작과 동시에true가 되어, 카드가 아직 뒷면인 상태에서 광채와 컨페티가 터졌습니다. (캡처에 물음표 뒷면 카드가 보라색 광채에 둘러싸인 채로 찍힘)→ 레어 강조를 회전 완료 후로 이동(
RARE_EMPHASIS_DELAY_MS = 500), 광채는 거기서 한 박자 더 뒤(delay: 0.45s)에 번지도록 조정.3. 피날레 카드가 그리드에 파묻힘
확대 카드가 260px(그리드 카드 116px)뿐이고 뒤 그리드가
opacity: 0.35로 살아 있어, 히어로 연출이 아니라 "잘못 놓인 카드"처럼 보였습니다.→
bg-black/75스크림을 깔고 카드를 320px로 확대.검증
pnpm --filter @gitanimals/web type-check통과미검증: reduced-motion 경로는 코드 분기만 확인했고 브라우저 재현은 하지 않았습니다.
🤖 Generated with Claude Code